<template>
  <div>
    <x-header :left-options="{backText: ''}">工作计划<a class="finish" @click="finish" slot="right">完成</a></x-header>
    <group class="programForm">
      <cell :title="'标题'">
        <img slot="icon" class="labelIcon" src="../../static/img/bt.png">
        <x-input text-align="right" class="titleInput wordStyle" placeholder="请输入标题" v-model="titleValue"></x-input>
      </cell>
      <cell :title="'项目'">
        <img slot="icon" class="labelIcon" src="../../static/img/xmmc.png">
        <popup-picker class="programPicker wordStyle" :columns="1" :data="programArr" ref="picker" show-name v-model="programValue" placeholder="请选择项目"></popup-picker>
      </cell>
      <cell :title="'开始时间'">
        <img slot="icon" class="labelIcon" src="../../static/img/shij.png">
        <datetime class="timePicker wordStyle" :start-date="startDate" style="font-size:14px;" :end-date="endDate" v-model="timeValue"  placeholder="请选择时间"></datetime>
      </cell>
      <cell :title="'填写人'">
        <img slot="icon" class="labelIcon" src="../../static/img/keh.png">
        <span class="wordStyle">管理员</span>
      </cell>
      <cell :title="'工作内容'">
        <img slot="icon" class="labelIcon" src="../../static/img/gongzneir.png">
      </cell>
      <x-textarea class="wordStyle textContent" v-model="textareaValue" placeholder="请输入工作内容"></x-textarea>
    </group>
  </div>
</template>
<script>
 import Utils from '*/js/modules/utils'
  import { Group, Cell, CellBox,XHeader,XInput,XTextarea,PopupPicker,Datetime} from 'vux'
  
  export default {
    data() {
      return {
        startDate:'2018-03-10',
        endDate:'2018-03-30',
        titleValue:'',
        programArr:[{name:'无锡地铁6号',value:'9'},{name:'无锡地铁7号',value:'10'}],
        programValue:[],
        timeValue:'',
        textareaValue:''
      }      
    },
    mounted() {
      var that = this;
      // that.axios.get(commonJson.commonData().domainName + '/api/WDS/goods/shopGoodsIndex', {
      //     params: {
      //       advert_site: 1
      //     }
      //   })
      //   .then(function (response) {
      //     console.log(response.data)
      //     if (response.data.code == 0) {
            
      //     } else {

      //     }
      //   })
      //   .catch(function (err) {
      //     console.log(err);
      //   });
    },
    components: {
      Group, Cell, CellBox , XHeader,XInput,XTextarea,PopupPicker,Datetime
    },
    methods: {
      finish(){
        if(this.titleValue==''){
          this.$vux.toast.text('标题不能为空');
        }else if(this.programValue==''){
          this.$vux.toast.text('请选择项目');
        }else if(this.timeValue==''){
          this.$vux.toast.text('请选择开始时间');
        }else if(this.textareaValue==''){
          this.$vux.toast.text('请输入工作内容');
        }else{
          let that=this;
          this.$vux.toast.show({
            text:'创建成功',
            type:'text',
            position:'middle',
            onHide(){
              that.$router.go(-1);
            }
          })
        }
      }
    }
  }

</script>
<style>
  .programForm .vux-label{
    font:14px/20px "microsoft yahei";
  }
  .wordStyle .weui-cell{
    padding:0;
  }
  .wordStyle .weui-input{
    font:14px/24px "microsoft yahei";
    color:#333;
  }
</style>

<style scoped>
  .wordStyle{
    font:14px/24px "microsoft yahei";
    color:#333;
    padding:0;
  }
  .labelIcon{
    width:30px;
    height:20px;
    display: block;
    padding-right:10px;
  }
  .titleInput{
    padding:0; 
  }
  .textContent{
    padding:10px 15px;
  }
</style>
